<template>
  <div ref="energyConsumption3" style="width: 100%; height: 380px"></div>
</template>

<script>
import * as echarts from "echarts";
import { leida3 } from "@/api/charts";

export default {
  mounted() {
    this.drawradar();
  },
  methods: {
    drawradar() {
      leida3()
        .then(({ data }) => {
          var chartDom = this.$refs.energyConsumption3;
          var myChart = echarts.init(chartDom);
          var option;
          option = {
            title: {
              text: "能源价格趋势对比图",
            },
            legend: {
              data: ["Allocated Budget", "Actual Spending"],
            },
            radar: {
              // shape: 'circle',
              indicator: [
                { name: "煤炭", max: 1000 },
                { name: "石油", max: 1000 },
                { name: "天然气", max: 1000 },
                { name: "电力", max: 1000 },
                { name: "核能", max: 1000 },
              ],
            },
            series: [
              {
                name: "Budget vs spending",
                type: "radar",
                data
              },
            ],
          };

          option && myChart.setOption(option);
        })
        .catch((err) => {});
    },
  },
};
</script>

<style>
</style>